<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
    <title>Login page</title>
    <link rel="stylesheet" type="text/css" href="/main.css"/>
    <script th:src="@{/main.js}"></script>
</head>
<body>
<section id="explanation" class="explain hide">
    <section class="container">
        <section class="title">
            <p>SAML Attribute Manipulation</p>
            <a href="/close" id="close" class="close">&#9747;</a>
        </section>
        <section class="explanation-content"><p>
            When the Mujina IDP sends a SAML assertion back to the service provider, all the attributes will be added as
            SAML AttributeStatement elements.
        </p>
            <p>
                Based on the Attribute Release Policy of the service provider they will be included in the authenticated
                user identity.
            </p>
            <p>If you want to add multiple values for one attribute - for example isMemberOf - then add them multiple
                times.</p>
            <p></p>

            <hr/>

            <p>If you add attributes and check the 'Persist me' box then the attributes will be saved under the 'Username'
                you have entered. </p>
            <p>On subsequent logins with the same username the same set of attributes will be send to the Service
                Provider.</p>
        </section>

    </section>
</section>

<section class="login-container">
    <section class="login">
        <h1>Mujina Identity Provider</h1>
        <p th:if="${param.error}" class="error">Wrong user or password</p>
        <form class="login-form" th:action="@{/login}" method="post">
            <input type="text" id="username" name="username" autofocus="autofocus" placeholder="Username"/>
            <input type="password" id="password" name="password" placeholder="Password"/>
            <input class="button" type="submit" value="Log in"/>
            <div>
                <input id="persist-me" name="persist-me" type="checkbox"/>
                <label class="persist-me" for="persist-me">Persist me?</label>
            </div>

            <section class="add-attribute">
                <select class="attribute-select" id="add-attribute">
                    <option value="Add attribute...">Add attribute...</option>
                    <option th:each="attr : ${samlAttributes}" th:value="${attr.get('name')}"
                            th:text="${attr.get('id')}"
                            th:attr="data-multiplicity=${attr.get('multiplicity')}"></option>
                </select>
                <div class="help"><span class="explain-link">?</span></div>
            </section>
            <section id="attribute-list" class="attribute-list"></section>

        </form>
    </section>
    <a class="powered-by" href="https://openconext.org/" target="_blank">Copyright © 2018 OpenConext</a>
</section>
</body>
</html>
